<template>
  <div class="modal-wrap">
    <a-form-model
      layout="horizontal"
      :model="formData"
      :label-col="{ xxl: { span: 4 }, sm: { span: 8 } }"
      :wrapper-col="{ xxl: { span: 20 }, sm: { span: 16 } }"
    >
      <a-row :span="24">
        <a-col :span="12">
          <a-form-model-item label="月份">
            {{ formData.month }}
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="日期">
            {{ formData.date }}
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row :span="24">
        <a-col :span="12">
          <a-form-model-item label="账号">
            {{ formData.userName }}
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="姓名">
            {{ formData.realName }}
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row :span="24">
        <a-col :span="12">
          <a-form-model-item label="mail">
            {{ formData.mail }}
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="省分">
            {{ formData.provName }}
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row :span="24">
        <a-col :span="12">
          <a-form-model-item label="地市">
            {{ formData.cityName || "--" }}
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="租户ID">
            {{ formData.tenantId }}
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row :span="24">
        <a-col :span="12">
          <a-form-model-item label="租户名称">
            {{ formData.tenantName }}
          </a-form-model-item>
        </a-col>
        <a-col :span="12">
          <a-form-model-item label="取数菜单">
            {{ formData.dialogFlag === "0" ? "规则分析" : "AI取数" }}
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-row :span="24">
        <a-col :span="24">
          <a-form-model-item
            label="用户问题描述"
            :label-col="{ xxl: { span: 2 }, sm: { span: 4 } }"
            :wrapper-col="{ xxl: { span: 22 }, sm: { span: 20 } }"
          >
            {{ formData.title }}
          </a-form-model-item>
        </a-col>
      </a-row>
    </a-form-model>
  </div>
</template>
<script setup>
const props = defineProps({
  formData: {
    type: Object,
  },
});
</script>
<style scoped lang="less">
.modal-wrap {
  width: 100%;
  max-height: 500px;
  overflow: hidden;
  overflow-y: auto;
  &::-webkit-scrollbar {
    width: 0.816667vw;
    height: 0.816667vw;
    background-color: #f8f8f8;
  }
  &::-webkit-scrollbar-thumb {
    border-radius: 0.333vw;
    box-shadow: inset 0 0 0.3125vw rgba(175, 175, 175, 0.3);
    background-color: #ebebeb;
  }
}
/deep/ .ant-row.ant-form-item.ant-form-item-with-help {
  margin-bottom: 0;
}
/deep/ .ant-row.ant-form-item {
  margin-bottom: 5px;
}
</style>
